<script setup>
// This starter template is using Vue 3 <script setup> SFCs
// Check out https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup
</script>

<template>
<canvas id="myCanvas" width="360" height="650"></canvas>
</template>

<script>
import facecat from './facecat.js';
let gPaint = new facecat.FCPaint();

/*
 * 重置大小
 */
let resizeAll = function () {
	try {
		const canvas = document.getElementById('myCanvas');
		canvas.width = document.documentElement.clientWidth;
		canvas.height = document.documentElement.clientHeight;
		facecat.scaleCanvas(gPaint);
		facecat.updateViewDefault(gPaint.views);
	} catch (err) {
	}
	facecat.invalidate(gPaint);
};
	
export default { 
	data() {
		return {
		}
	},
	onLoad() {
	}, 
	mounted(){
			const canvas = document.getElementById('myCanvas');
			gPaint.isMobile = facecat.isMobileMode();
			window.addEventListener('resize', resizeAll, true);
			let context = canvas.getContext("2d"); //绘图上下文
			canvas.width = window.innerWidth;
			canvas.height = window.innerHeight;
			gPaint.canvas = canvas;
			facecat.scaleCanvas(gPaint);
			//注册事件
			facecat.addDefaultEvent(canvas, gPaint);
			//解析加载XML
			let xml = `<?xml version="1.0" encoding="utf-8"?>
			<html xmlns="facecat">
			  <head>
			  </head>
			  <body>
				<div dock="fill" type="tab" selectedindex="0">
				  <div name="TabPage" text="可视化生成" type="tabpage">
					<tree name="Tree" text="Tree" location="45,56" size="200,200" headervisible="False">
					</tree>
				  </div>
				  <div name="TabPage2" text="代码创建" type="tabpage" />
				</div>
			  </body>
			</html>
			`;
			facecat.renderFaceCat(gPaint, xml);
			let tree = facecat.findViewByName("Tree", gPaint.views);
			tree.showCheckBox = true;
			let column = new facecat.FCTreeColumn();
			column.width = 500;
			tree.columns.push(column);
	
			let rootNode = new facecat.FCTreeNode();
			rootNode.value = "证监会行业类";
			facecat.appendTreeNode(tree, rootNode, null);
	
			let node1 = new facecat.FCTreeNode();
			node1.value = "农、林、牧、渔业";
			facecat.appendTreeNode(tree, node1, rootNode);
	
			let strs1 = new Array();
			strs1.push("农业");
			strs1.push("林业");
			strs1.push("畜牧业");
			strs1.push("渔业");
			strs1.push("农、林、牧、渔服务业");
			for (let i = 0; i < strs1.length; i++) {
				let subNode1 = new facecat.FCTreeNode();
				subNode1.value = strs1[i];
				facecat.appendTreeNode(tree, subNode1, node1);
			}
	
			let node2 = new facecat.FCTreeNode();
			node2.value = "采矿业";
			facecat.appendTreeNode(tree, node2, rootNode);
	
			let strs2 = new Array();
			strs2.push("煤炭开采和洗选业");
			strs2.push("石油和天然气开采业");
			strs2.push("黑色金属矿采选业");
			strs2.push("有色金属矿采选业");
			strs2.push("非金属矿采选业");
			strs2.push("开采辅助活动");
			for (let i = 0; i < strs2.length; i++) {
				let subNode2 = new facecat.FCTreeNode();
				subNode2.value = strs2[i];
				facecat.appendTreeNode(tree, subNode2, node2);
			}
	
			let node3 = new facecat.FCTreeNode();
			node3.value = "制造业";
			facecat.appendTreeNode(tree, node3, rootNode);
	
			let strs3 = new Array();
			strs3.push("农副食品加工业");
			strs3.push("食品制造业");
			strs3.push("酒、饮料和精制茶制造业");
			strs3.push("纺织业");
			strs3.push("纺织服装、服饰业");
			strs3.push("皮革、毛皮、羽毛及其制品和制鞋业");
			strs3.push("木材加工和木、竹、藤、棕、草制品业");
			strs3.push("家具制造业");
			strs3.push("造纸和纸制品业");
			strs3.push("印刷和记录媒介复制业");
			strs3.push("文教、工美、体育和娱乐用品制造业");
			strs3.push("石油加工、炼焦和核燃料加工业");
			strs3.push("化学原料及化学制品制造业");
			strs3.push("医药制造业");
			strs3.push("化学纤维制造业");
			strs3.push("橡胶和塑料制品业");
			strs3.push("非金属矿物制品业");
			strs3.push("黑色金属冶炼和压延加工业");
			strs3.push("有色金属冶炼和压延加工业");
			strs3.push("金属制品业");
			strs3.push("通用设备制造业");
			strs3.push("专用设备制造业");
			strs3.push("汽车制造业");
			strs3.push("铁路、船舶、航空航天和其他运输设备制造业");
			strs3.push("电气机械和器材制造业");
			strs3.push("计算机、通信和其他电子设备制造业");
			strs3.push("仪器仪表制造业");
			strs3.push("其他制造业");
			strs3.push("废弃资源综合利用业");
			for (let i = 0; i < strs3.length; i++) {
				let subNode3 = new facecat.FCTreeNode();
				subNode3.value = strs3[i];
				facecat.appendTreeNode(tree, subNode3, node3);
			}
			facecat.invalidate(gPaint);
			},
			methods: {  
	}
}
</script>
